<!-- UeditorWrap -->
<template>
  <div>
    <label v-if="label !== null">{{label}}</label>
    <vue-ueditor-wrap class="ueditor-wrap" :config="myConfig" :value="value === null ? '' : value" @input="contentChangeHandle"></vue-ueditor-wrap>
  </div>
</template>

<script>
import VueUeditorWrap from 'vue-ueditor-wrap'
export default {
  name: 'UeditorComponent',
  props: {
    value: {
      type: String,
      default: ''
    },
    label: {
      type: String,
      default: null
    },
    height: {
      type: String,
      default: '300px'
    }
  },
  components: { VueUeditorWrap },
  data: function () {
    return {
      msg: this.value,
      myConfig: {
        zIndex: 4000,
        autoHeightEnabled: false,
        // 初始容器高度
        initialFrameHeight: 300,
        // 初始容器宽度
        initialFrameWidth: '100%',
        serverUrl: process.env.VUE_APP_API_BASE_URL + '/php/controller.php'
        // serverUrl: 'http://35.201.165.105:8000/controller.php'
      }
    }
  },
  created: function () {
  },
  watch: {
    // msg: function(newValue, oldValue) {
    //   // console.log(newValue)
    //   this.$emit('input', newValue)
    // }
  },
  computed: {},
  methods: {
    contentChangeHandle: function(e) {
      this.$emit('input', e)
    }
  }
}
</script>
